<template>
    <div class="w100_ h100_ flex-column hidden">
        <div class="flex-row-center greycolor pd20">
            <span class="weight pointer mr30 flex-row-center" @click="close"><img class="arrowfont" src="../../assets/icon/licon.png"> 返回</span>
            <span class="flex-row-center">
                <span class="flex-row-center" v-for="(v,i) in props.tags" :key="i">
                    <img class="arrowfont ml5 mr5" v-if="i!=0" src="../../assets/icon/ricon.png">
                    <span>{{v}}</span>
                </span>
            </span>
        </div>
        <div class="w100_ flex1 flex-column pd20-row hidden">
            <span class="titleLabel mb20">
                <span>承办进展</span> <span class="ml30">文件名称：{{props.name||'暂无'}}</span>
            </span>
            <div v-if="obj.progress.length>0" id="progress" class="w100_ flex1 overflow-y">
                <el-timeline>
                    <el-timeline-item v-for="(v, i) in obj.progress" :key="i" color="#356F5D" :timestamp="v.intime">
                        <span>{{v.msg||''}}</span>
                    </el-timeline-item>
                </el-timeline>
                <div v-if="obj.progress[0].shownodata" class="flex1 w100_ flex-center nodatas mb30">-- 到底了 --</div>
            </div>
            <div v-else class="flex1 w100_ flex-center nodatas">暂无进展</div>
        </div>
    </div>    
</template>
<script setup>
import { ref,reactive,getCurrentInstance,toRefs,toRaw,computed, pushScopeId,watch,onMounted,onDeactivated } from 'vue'
let { proxy } = getCurrentInstance()
const emit = defineEmits(['close']) //此处要完全对应，采用固定的update:prop属性

const props = defineProps({
    id: {
        type: String,
        default: ''
    },
    name: {
        type: String,
        default: ''
    },
    tags: {
        type: Array,
        default: []
    }
})

const obj = reactive({
    progress: []
})

onMounted(() => {
    geProgress()
})

onDeactivated(() => {
    close()
})


const geProgress=()=>{
    proxy.$ajax({
        url: '/manager/file/progress',
        data: { file_id: props.id },
        bfLoading: true
    }).then(d => {
        obj.progress = d.msg.list||[]
        if(obj.progress.length){
            setTimeout(() => {
                obj.progress[0].shownodata = proxy.$util.hasScrolled('progress')
            }, 0);
        }
    }).catch(e => {
        obj.progress = []
    })
}

const close=()=>{
    obj.progress = []
    emit('close')
}
</script>

<style lang="scss" scoped>

</style>